<template>
  <view class="gift">
    <view class="batch_box">
      <text class="batch" @tap="batchClick">批量增送</text>
    </view>
    <view class="">
      <text>当前优惠券可赠送数量：{{ operative ? operative : 0 }} 张</text>
    </view>
    <up-checkbox-group v-model="checkAllArray">
      <view class="item_name" v-for="item in staffData" :key="item.userId">
        <up-checkbox :size="18" :icon-size="12" :name="item.userId" />
        <staffItem
          :listData="item"
          @on-click="headelstaffItemClick"
          @check-change="headelstaffItemChange"
        />
      </view>
    </up-checkbox-group>
  </view>
  <up-modal
    :show="show"
    :showCancelButton="true"
    title="赠送优惠券"
    @confirm="headelConfirmClick"
    @cancel="headelCancelClick"
  >
    <view class="slot-content">
      <up-input
        v-model="stateVal"
        placeholder="请输入赠送优惠券数量"
        border="surround"
        clearable
        type="number"
      >
        <template #suffix> 张 </template>
      </up-input>
    </view>
  </up-modal>
</template>

<script setup>
import { getEnterpriseEmpPageList, getUserInfoApi } from "@/api/user/index.js";
import {
  getManagerCanGiftNumbeApi,
  giftCouponApi,
} from "@/package_coupon/api/index.js";
import staffItem from "@/package_coupon/components/staff-card/staff.vue";
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "vue";
const person = ref("");
const checkAllArray = ref([]);
const checkArray = ref([]);
const staffData = ref([]);
const enterpriseId = ref("");
const stateVal = ref("");
const couponId = ref("");
const operative = ref("");
const pageInd = ref(1);
const total = ref(0);
const show = ref(false);
const checkData = ref({});
const userInfo = ref({});
// 点击赠送
function headelstaffItemClick(data) {
  console.log(data);
  show.value = true;
  person.value = "个人"
  checkArray.value = [];
  checkArray.value.push(data.userId);
}
// 选中切换
function headelstaffItemChange(data) {
  console.log(data);
  if (checkAllArray.value.indexOf(data.userId) == -1) {
    checkAllArray.value.push(data.userId);
  } else {
    let newArr = checkAllArray.value.filter((item) => item !== data.userId);
    checkAllArray.value = newArr;
  }
}
// 获取企业员工列表
async function getUserInfo() {
  const res = await getUserInfoApi();
  const { code, data } = res || {};
  if (code == 200) {
    userInfo.value = data;
    enterpriseId.value = data.enterpriseId;
    getEnterpriseEmpPageListData();
  }
}
// 获取企业员工列表
async function getEnterpriseEmpPageListData() {
  let parameter = {
    enterpriseId: enterpriseId.value,
    limit: 10,
    page: pageInd.value,
  };

  const res = await getEnterpriseEmpPageList(parameter);
  const { code, data } = res;
  if (code == 200) {
    const listData = data.records.map((o) => {
      return {
        url: o.avatar,
        name: o.realName,
        manage: o.isManager == "1" ? true : false,
        remove: o.isManager == "1" ? false : true,
        position: o.majorName,
        state: o.checkStatus,
        userId: o.userId,
      };
    });
    staffData.value = listData.filter((o) => o.userId !== userInfo.value.id);
    total.value = data.total - 1;
  }
}
function headelConfirmClick() {
  giftCoupon();
}
function headelCancelClick() {
  show.value = false;
  stateVal.value = "";
}
async function getManagerCanGiftNumbe() {
  const res = await getManagerCanGiftNumbeApi(couponId.value);
  const { code, data } = res || {};
  if (code == 200) {
    console.log("operative", data);
    operative.value = data;
  }
}
function batchClick() {
  if (checkAllArray.value.length == 0) {
    uni.showToast({
      title: "请勾选需赠送的人员",
      duration: 2000,
      icon: "none",
    });
  } else {
  person.value = "批量"
    show.value = true;
  }
}
async function giftCoupon() {
  if (person.value == "个人") {
    checkData.value = checkArray.value.map((o) => {
    return {
      giftNumber: Number(stateVal.value) ,
      couponId: couponId.value,
      enterpriseId: enterpriseId.value,
      userId: o,
    };
  });
  } else {
    checkData.value = checkAllArray.value.map((o) => {
    return {
      giftNumber: Number(stateVal.value),
      enterpriseId: enterpriseId.value,
      couponId: couponId.value,
      userId: o,
    };
  });
  }
  console.log("checkData.value", checkData.value);
  const res = await giftCouponApi(checkData.value);
  const { code, data } = res || {};
  if (code == 200) {
    uni.showToast({
      title: "赠送成功",
      duration: 2000,
      icon: "success",
    });
    show.value = false;
    stateVal.value = "";
    checkAllArray.value = [];
    getManagerCanGiftNumbe();
  }
}
onLoad((option) => {
  console.log("option", option);
  couponId.value = option.couponId;
  getManagerCanGiftNumbe();
  getUserInfo();
});
</script>

<style lang="less" scoped>
.gift {
  padding: 0 20rpx;
  .batch_box {
    margin: 30rpx 0;
    color: @color-green;
    font-size: @font-size-27;
  }
  .item_name {
    display: flex;
    flex-flow: row nowrap;
  }
}
</style>